<#assign pageTitle="我的 - ${siteCompany.siteName!}"/>
<#assign pageHeader>
    <link rel="stylesheet" href="/static/h5/css/user.css">
</#assign>
<#assign pageContent>
    <div class="user-header">
        <div class="user-details">
            <img src="${user.cover!'/static/images/default.png'}" alt="" class="user-avatar fl">
            <div class="user-info fl">
                <div>${user.userName!}<span>(服务ID：${user.userId!})</span></div>
                <p>
                    <#if userMobile??>
                        <van-icon name="phone" /> ${userMobile!}
                        <#else>
                            <span @click="popupShow()"><van-icon name="phone"></van-icon>点击绑定手机</span>
                    </#if>
                </p>
            </div>
        </div>
        <div class="user-menu">
            <a href="/user/favorite.html">
                <van-icon name="star" ></van-icon>
                收藏夹
            </a>
            <a href="/user/course/list.html">
                <van-icon name="send-gift" ></van-icon>
                我的课程
            </a>
            <a href="/user/member.html">
                <van-icon name="vip-card" ></van-icon>
                会员中心
            </a>
            <a href="/user/account.html">
                <van-icon name="gold-coin" ></van-icon>
                我的账户
            </a>
        </div>
        <div class="user-about">
            <#if lastStudyCourse?? >
                <div class="lastStudyCourse user-about-study">
                    <img src="${lastStudyCourse.cover!}" class="fl" alt="">
                    <div class="user-course-name">
                        <p class="text-one">${lastStudyCourse.courseName}</p>
                        <van-button type="default"  icon="add-o" url="/user/course/play.html?nodeId=${lastStudyCourse.courseStudyHistory.nodeId}">继续学习</van-button>
                    </div>
                </div>
            <#else>
                <div class="lastStudyCourse">
                    <img src="/static/h5/images/header-menu-1.png" class="fl" alt="">
                    <div class="user-course-name">
                        <p class="text-one">您还未报名任何课程</p>
                        <van-button type="default"  icon="add-o" url="/course/pro/list.html">我要学习</van-button>
                    </div>
                </div>
            </#if>
        </div>
        <a href="/user/account.html" class="user-money"><van-icon name="balance-o" /> ${userAccount.balance/100.0} 元</a>
    </div>
    <div class="user-link">
        <a href="/user/order/list.html">
            <img src="/static/h5/images/user/2.png" alt="" class="fl">
            <span class="fl">我的订单</span>
            <van-icon name="arrow" class="fr"></van-icon>
        </a>
        <a href="/user/invites.html">
            <img src="/static/h5/images/user/3.png" alt="" class="fl">
            <span class="fl">分享赚钱</span>
            <van-icon name="arrow" class="fr"></van-icon>
        </a>
        <a href="/user/study/list.html">
            <img src="/static/h5/images/user/5.png" alt="" class="fl">
            <span class="fl">学习记录</span>
            <van-icon name="arrow" class="fr"></van-icon>
        </a>
        <a href="/user/download/list.html">
            <img src="/static/h5/images/user/7.png" alt="" class="fl">
            <span class="fl">下载记录</span>
            <van-icon name="arrow" class="fr"></van-icon>
        </a>
        <a href="/user/letter.html">
            <img src="/static/h5/images/user/6.png" alt="" class="fl">
            <span class="fl">消息中心</span>
            <van-icon name="arrow" class="fr"></van-icon>
            <van-badge :content="letterCount" max="99" class="fr" v-if="letterCount > 0" style="margin-top: 19px"></van-badge>
        </a>
        <a href="/user/info.html">
            <img src="/static/h5/images/user/4.png" alt="" class="fl">
            <span class="fl">个人信息</span>
            <van-icon name="arrow" class="fr"></van-icon>
        </a>
    </div>
    <van-popup
            v-model="bindingPopup"
            closeable
            close-icon-position="top-right"
            position="bottom"
            :style="{ height: '500px' }"
    >
        <iframe src="/user/binding/mobile.html" width="100%" height="100%"></iframe>
    </van-popup>
</#assign>
<#assign pageScript>
    <script>
        var userId = ${user.userId};
        var letterCount = ${user.letterCount};
        new Vue({
            el: '#app',
            data() {
                return {
                    bindingPopup: false,
                    showFooter: true,
                    activeTab: 6,
                    letterCount : letterCount
                }
            },
            methods: {
                toPlay(courseId) {
                    window.location.href = '/user/course/play.html?courseId=' + courseId;
                },
                toView(id) {
                    window.location.href = '/course/view/' + id + '.html';
                },
                popupShow(){
                    this.bindingPopup = true;
                }
            },
        });
    </script>
</#assign>
<#include "../layout_h5.ftl" />